/**
 * Created by x on 2017/7/24.
 */
$(document).ready(function () {
    //每一次进来,数据清零
    localStorage.clear();

    console.log("ready ");

    var interactObj = undefined;
    var qt_socket = {recv_cb:action,send:undefined};

    var connect_flag = 0;
    var is_in_the_arry = 0;

    var save_dat = [];

    // var demo_time_cnt =25;
    var raw_save_data ;
    //获取到本地存储的游戏时间
    raw_save_data = localStorage.getItem('user_time');
    //从一个字符串中解析出json对象
    save_dat = JSON.parse(raw_save_data);

    $("#page1").show();
    $("#page2").hide();
    $("#page3").hide();

    var cur_game_flag = 0;
    var cur_time_cnt = 0;
    function action(dat)
    {
        console.log(dat);
        //将json对象转换成json字符串
        var str = JSON.stringify(dat);
        $("#output").append(str);

        connect_flag = dat.Dobot_state;

        if(connect_flag)
        {
            $("#connect_state").text("已经成功连接 DOBOT 机械臂");
        }
        else
        {
            $("#connect_state").text("请先连接 DOBOT 机械臂");
        }

        //将游戏一共花费的时间渲染到页面上
        $("#time_cnt").text(dat.time_count + " s");

        cur_time_cnt = dat.time_count;

        cur_game_flag = dat.game_over;

        //判断 当游戏正常结束的时候
        if(dat.game_over==1)
        {


            var user_time = cur_time_cnt;
            is_in_the_arry = 0;
            var item_save = {rec:0};
            //判断 当本地存储是undefined的时候 或者 数据少于 3个 的时候
            if( (save_dat==undefined)   || (save_dat.length<3) )
            {
                is_in_the_arry = 1;
                // 判断 当本地存储是undefined的时候
                if(save_dat==undefined)
                {
                    //定义save_dat为一个空的数组
                    save_dat=[];
                    //将游戏的时间存储到本地数组当中
                    item_save.rec = user_time;
                    //将第一个数据对象存到本地数组,作为数组的第一个数据
                    save_dat[0] = item_save;
                }
                //判断 当本地存储数组中有值的时候
                else
                {
                    //直接添加进数组
                    item_save.rec =user_time;
                    save_dat.push(item_save);
                }
            }
             //判断 当本地存储数组中有数据 并且 个数 >=3 的时候
            else
            {
                //首先初始化一个最大时间
                var max_time = 0;
                //初始化索引
                var pos = 0;
                //遍历 数组 获取本地数组中最大时间
                for(var i = 0; i<save_dat.length;i++)
                {
                    // console.log(i,": ",save_dat[i]);
                    if(save_dat[i].rec>max_time){
                        max_time = save_dat[i].rec;
                        pos = i;
                    }
                }


                // console.log("max_time:",max_time,"cur_time:",user_time);
                //判断 如果 本地数组的最大的时间 比 刚传进来的游戏时间 大
                if(max_time>user_time)
                {
                    save_dat[pos].rec = user_time;
                    //is_in_the_arry 为 1 的时候 表示刚传进来的游戏时间进入的排行版
                    is_in_the_arry = 1;
                    console.log("new recorder modify!!",save_dat);
                }
            }

            // console.log("localStorage.setItem",save_dat);
            //将数据写入本地存储中 将json对象转换才json字符串
            localStorage.setItem('user_time',JSON.stringify(save_dat) );

            $("#page3").show('fast');
            $("#page2").hide('fast');
            $('.l_r_cent p').text(cur_time_cnt + " S");
            //判断 刚传入的时间 是否 有进入 排行版
            if(is_in_the_arry)
            {
                $('.l_r_cent h3').text('您真的太棒了!');
            }
            else
            {
                $('.l_r_cent h3').text('很遗憾,还需要继续努力!!');
            }
            //因为传进来的是一个数组对象,我定义一个新的空数组
            var newArr = [];
            //save_dat = [{"rec":43},{"rec":42},{"rec":44}]
            //遍历这个数组对象,获取到每一个对象的属性值
            for(var j = 0; j<save_dat.length;j++){
                newArr.push(save_dat[j].rec);
            }

            //排序
            //遍历这个新的数组,将数据渲染到排行版中
            for(var k = 0;k<newArr.length;k++){
                for(var g = k+1; g<newArr.length;g++){
                    if(newArr[k] > newArr[g]){
                        var tmp = newArr[k];
                        newArr[k] = newArr[g];
                        newArr[g] = tmp;
                    }
                }
                $('#ul li span').eq(k).text(newArr[k] + " S");
            }
            console.log(newArr);

            //判断 正常游戏超出规定时间
        }else if(dat.game_over==0){
            $("#page3").show('fast');
            $("#page2").hide('fast');
            $('.l_r_cent p').text(cur_time_cnt + " S");
            $('.l_r_cent h3').text('游戏失败!');
            //排行版数据还是需要展示出来
            //因为传进来的是一个数组对象,我定义一个新的空数组
            var newArr = [];
            //save_dat = [{"rec":43},{"rec":42},{"rec":44}]
            //遍历这个数组对象,获取到每一个对象的属性值
            for(var j = 0; j<save_dat.length;j++){
                newArr.push(save_dat[j].rec);
            }
            //排序
            //遍历这个新的数组,将数据渲染到排行版中
            for(var k = 0;k<newArr.length;k++){
                for(var g = k+1; g<newArr.length;g++){
                    if(newArr[k] > newArr[g]){
                        var tmp = newArr[k];
                        newArr[k] = newArr[g];
                        newArr[g] = tmp;
                    }
                }
                $('#ul li span').eq(k).text(newArr[k] + " S");
            }

        }
    }


    new QWebChannel(qt.webChannelTransport, function(channel) {
        // 获取Qt类交互对象
        interactObj = channel.objects.interactObj;

        // 调用Qt类公有函数
        interactObj.recvStringSlot("成功连接到qt Channel");

        qt_socket.send = function (dat) {
            interactObj.recvStringSlot(JSON.stringify(dat));
        };

        interactObj.sendStringSignal.connect(function(str) {
            if(qt_socket.recv_cb!=undefined)
            {
                qt_socket.recv_cb(JSON.parse(str));
            }
        });
    });



    $("#start_btn").mousedown(function () {
        $("#start_btn").css("padding-top",5);
        $("#start_btn").css("padding-left",5);
		
			if(connect_flag)
        {
            var send_json={start:1};
            qt_socket.send(send_json);
            $("#page2").show('fast');
            $("#page1").hide('fast');
            $("#page3").hide('fast');
            $("#start_btn").css("padding-top",0);
            $("#start_btn").css("padding-left",0);
        }


    });

    $("#start_btn").mouseup(function () {
        $("#start_btn").css("padding-top",0);
        $("#start_btn").css("padding-left",0);
    });



    $("#stop_btn").mousedown(function () {
        $("#stop_btn").css("padding-top",5);
        $("#stop_btn").css("padding-left",5);

			// if(connect_flag)
        {
            var send_json={start:0};
            qt_socket.send(send_json);

            // demo_time_cnt -= 5;
            // var test_json={ Dobot_state:1,
            //                 game_flag:1,
            //                 game_over:1,
            //                 time_count:demo_time_cnt};
            // action(test_json);

            $("#page1").show('fast');
            $("#page2").hide('fast');
            $("#stop_btn").css("padding-top",0);
            $("#stop_btn").css("padding-left",0);
        }


    });


    $("#stop_btn").mouseup(function () {
        $("#stop_btn").css("padding-top",0);
        $("#stop_btn").css("padding-left",0);
    });



    $("#replay_btn").mousedown(function () {
        console.log("click");
        $("#replay_btn").css("padding-top",5);
        $("#replay_btn").css("padding-left",5);

        if(connect_flag)
        {
            $("#page1").show('fast');
            $("#page3").hide('fast');
            $("#replay_btn").css("padding-top",0);
            $("#replay_btn").css("padding-left",0);
        }


    });

    $("#replay_btn").mouseup(function () {
        $("#replay_btn").css("padding-top",0);
        $("#replay_btn").css("padding-left",0);
    });




    //---
    resize_all();
    $(window).resize(function(){
        resize_all();
    });

    function resize_all(){

        FullScreenBackground('#bigpic');
        resize_all_comp();
    }

    function FullScreenBackground(theItem){
        var winWidth=$(window).width();
        var winHeight=$(window).height();
        var imageWidth=$(theItem).width();
        var imageHeight=$(theItem).height();


        $(theItem).css("height",winHeight);
        $(theItem).css("width",winWidth);

    }


    function resize_all_comp()
    {
        var winWidth=$(window).width();
        var winHeight=$(window).height();

        if(winHeight>750)
        {
            var tag_hi = winHeight*2/15;
            // console.log("tag_hi:",tag_hi*2)
            $("#guide").css("margin-top",tag_hi*1.6);
            $("#start_btn").css("margin-top",tag_hi-80);

            $("#page2_cont").css("margin-top",tag_hi*1.6);
            $("#stop_btn").css("margin-top",tag_hi-80);

        }

        if(winWidth>1150)
        {
            var tag_wi = (winWidth - 1150)/2;
            console.log("tag_wi:",tag_wi)
            $("#guide").css("padding-left",tag_wi);

            var tag_wi = (winWidth - 800)/2;
            $("#page2_cont").css("padding-left",0);
        }

    }

});